<#include "/oms/iframe/common/head_index.html" />
<div class="row">
	<div class="col-xs-12">
		<div class="box">
			<div class="box-header">
				<h3 class="box-title">用户管理</h3>
				<div class="box-tools pull-right">
					<@shiro.hasPermission name="system:authority:user:save">
						<a  class="btn btn-sm btn-primary" target="modal" modal="lg" href="${request.contextPath}/system/authority/user/add">添加</a>
					</@shiro.hasPermission>
				</div>
			</div>
			<div class="box-body">
				<div class="clearfix">
					<form id="search-form" class="" >
						<div class="col-md-3">
							<div class="input-group date ">
								<div class="input-group-addon">
									<i class="fa fa-calendar"></i>
								</div>
								<input type="text"  class="form-control pull-right" name="beginCreatedTime" placeholder="选择开始时间...">
							</div>
						</div>
						<div class="col-md-3">
							<div class="input-group date ">
								<div class="input-group-addon">
									<i class="fa fa-calendar"></i>
								</div>
								<input type="text" class="form-control pull-right" name="endCreatedTime" placeholder="选择结束时间...">
							</div>
						</div>
						<div class="col-md-3">
							<div class="input-group">
								<span class="input-group-addon"><i class="fa fa-search"></i></span>
								<input type="text" class="form-control" name="loginname" placeholder="根据登录名搜索...">
							</div>
						</div>
						<div class="col-md-3">
							<button type="button" class="btn btn-primary btn-table-refresh">搜索</button>
						</div>
					</form>
				</div>
				<div class="clearfix" style="padding-top: 15px;">
					<table id="table-data" class="table table-bordered table-striped">
					</table>
				</div>
			</div>
		</div>
	</div>
</div>
<#include "/oms/iframe/common/setting_index.html" />
<#include "/oms/iframe/common/bottom_index.html" />
<script type="text/javascript">
$(function() {

    $(".btn-table-refresh").on("click",function () {
        searchRefresh();
    });


	var $dataTable = $("#table-data");

	$.datetimepicker.setLocale('ch');
	//初始化时间选择器
	$('[name=beginCreatedTime]').datetimepicker({
		format:"Y/m/d 00:00:00",      //格式化日期
		timepicker:true,    //开启时间选项
		yearStart:2000,     //设置最小年份
		yearEnd:2050,        //设置最大年份
		todayButton:false    //关闭选择今天按钮
	});
	
	//初始化时间选择器
	$('[name=endCreatedTime]').datetimepicker({
		format:"Y/m/d 23:59:59",      //格式化日期
		timepicker:true,    //开启时间选项
		yearStart:2000,     //设置最小年份
		yearEnd:2050,        //设置最大年份
		todayButton:false    //关闭选择今天按钮
	});

    initDataGrid();

});

function initDataGrid(){

	 $dataTable.bootstrapTable({
        idField : "id",
        columns : [[
            {title: "序号", field: "index" ,width:10,formatter: function (value, row, index) {
                return index+1;
            }},
            {title: "登录名", field: "loginname" },
            {title: "昵称", field: "nickname" },
            {title: "QQ", field: "qq" },
            {title: "邮箱", field: "email" },
            {title: "手机号", field: "phone" },
            {title: "描述", field: "description" },
            {title: "创建时间", field: "createdTime" ,formatter:dateFormat},
            {title: "创建人", field: "createdBy" },
            {title: "修改时间", field: "modifiedTime" ,formatter:dateFormat},
            {title: "修改人", field: "modifiedBy" },
            {title: "操作", field: "operate", align: 'center',formatter: operateFormatter}
        ]],
        url : '${request.contextPath}/system/authority/user/grid',
        queryParams: function(params){
            var searchForm = $("#search-form");
            var formData = searchForm.serializeObject();
            if(params.sort){
                formData["sort"]=params.sort;
                formData["order"]=params.order;
            }
            formData["offset"]=params.offset;
            formData["limit"]=params.limit;

            return formData;
        },
        responseHandler : function (res) {
            return {
                rows : res.rows,
                total : res.total
            }
        },
        search : false,
        searchOnEnterKey : false,
        sortName : 'createdTime',
        sortOrder : 'asc',
        pagination : true,
        sidePagination : 'server',
        pageSize: 10,
        pageList : [10,20, 40, 50, 100],
        showRefresh : true,
        showToggle : true
    });
}

function searchRefresh(){
	$("#table-data").bootstrapTable('refresh');
}

function operateFormatter(value, row, index) {
    return [
		'<@shiro.hasPermission name="system:authority:user:assign:role">'
		+ '<a class="btn btn-sm btn-warning "  title="授权" target="modal" modal="sm" href="${request.contextPath}/system/authority/user/assign/role?id=' + row.id + '"  >'
		+ '	<i class="glyphicon glyphicon-wrench"></i> '
		+ '</a>  '
		+ '</@shiro.hasPermission>'
		+ '<a class="btn btn-sm btn-info "  title="查看" target="modal" modal="lg" href="${request.contextPath}/system/authority/user/view?id=' + row.id + '"  >'
		+ '	<i class="glyphicon glyphicon-check"></i> '
		+ '</a>  '
		+ '<a class="btn btn-sm btn-warning" title="修改" target="modal" modal="lg" href="${request.contextPath}/system/authority/user/update?id=' + row.id + '" >'
		+ '	<i class="glyphicon glyphicon-edit"></i> '
		+ '</a>  '
		+ '<@shiro.hasPermission name="system:authority:user:reset-password">'
		+ '<a class="btn btn-sm btn-primary"  title="重置密码" target="modal" modal="sm" href="${request.contextPath}/system/authority/user/reset-password?id=' + row.id + '"  >' + "\t<i class=\"glyphicon glyphicon-backward\"></i> </a>  </@shiro.hasPermission><a class=\"btn btn-sm btn-danger\"  title=\"删除\" callback=\"searchRefresh()\" data-body=\"确认要删除吗？\" target=\"ajaxTodo\" method=\"DELETE\" href=\"${request.contextPath}/system/authority/user/delete?id="+ row.id + '">'
        +'	<i class="glyphicon glyphicon-remove"></i>'
        + '</a>&nbsp;'
    ].join('');
}
</script>